import { Component } from '@angular/core';

import { FindPage } from '../find/find';
import { IonicNativePage } from '../ionic-native/ionic-native';
//import { HomePage } from '../home/home';
import { SlidingItemPage } from '../sliding-list/sliding-item';
import { SettingsListPage } from '../settings/settings';



import { NativePageTransitions, NativeTransitionOptions } from '@ionic-native/native-page-transitions';

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {

	loaded:   boolean = false;
	tabIndex: number  = 0;

  //tab1Root = HomePage;
  tab1Root = SlidingItemPage
  tab2Root = FindPage;
  tab3Root = IonicNativePage;
  tab4Root = SettingsListPage;

  constructor(private nativePageTransitions: NativePageTransitions) {

  }

  private getAnimationDirection(index):string {
    var currentIndex = this.tabIndex;

    this.tabIndex = index;

    switch (true){
      case (currentIndex < index):
        return('left');
      case (currentIndex > index):
        return('right');
    }
  }

  public transition(e):void {    
    let options: NativeTransitionOptions = {
     direction:this.getAnimationDirection(e.index),
     duration: 400,
     slowdownfactor: -1,
     slidePixels: 0,
     iosdelay: 20,
     androiddelay: 0,
     fixedPixelsTop: 0,
     fixedPixelsBottom: 48
    };

    if (!this.loaded) {
      this.loaded = true;
      return;
    }

    this.nativePageTransitions.slide(options);
  }

}
